// tailwind.config.ts
import type { Config } from "tailwindcss";
import responsiveFontSize from "@/plugins/responsive-font-size";

const config: Config = {
  content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
  theme: {
    extend: {
      colors: {
        primary: "#2563eb",
        secondary: "#64748b"
      },
      fontFamily: {
        sans: ["Inter", "system-ui", "sans-serif"]
      },
      screens: {
        xs: "480px",
        sm: "640px",
        md: "768px",
        lg: "1024px",
        xl: "1280px",
        "2xl": "1536px"
      }
    }
  },
  plugins: [
    responsiveFontSize({
      min: "13px",
      max: "20px",
      factor: "1vw + 10px"
    })
  ]
};

export default config;
